//配置路由
import Vue from "vue";

import VueRouter from 'vue-router'

Vue.use(VueRouter)
import {getUserToken} from '@/utils/user_token'

//先将原来的push保存一份，以解决重复传递parameters报错问题
let originPush = VueRouter.prototype.push
VueRouter.prototype.push = function (location, resolve, reject) {
    if (resolve && reject) {
        originPush.call(this, location, resolve, reject)
        //保证this指的是VueRouter
        //call与apply调用：都能修改上下文（及this）
        //但不同点在于，call参数用"，"隔开，而apply用数组隔开
    } else {
        originPush.call(this, location, () => {
        }, () => {
        })
    }
}

//先将原来的replace保存一份，以解决重复传递parameters报错问题
let originReplace = VueRouter.prototype.replace
VueRouter.prototype.replace = function (location, resolve, reject) {
    if (resolve && reject) {
        originReplace.call(this, location, resolve, reject)
        //保证this指的是VueRouter
        //call与apply调用：都能修改上下文（及this）
        //但不同点在于，call参数用"，"隔开，而apply用数组隔开
    } else {
        originReplace.call(this, location, () => {
        }, () => {
        })
    }
}

let router = new VueRouter(
    {
        routes: [
            {
                path: '/home',
                component: ()=>import('@/pages/Home'),
                meta: {
                    showFooter: true
                },
                name: 'home',
            },
            {
                path: '/register',
                component: ()=>import('@/pages/Register'),
                name: 'register',
            },
            {
                path: '/login',
                component: ()=>import('@/pages/Login'),
                name: 'login',
            },
            {
                path: '/search/:keyword?',
                component: ()=>import('@/pages/Search'),
                meta: {
                    showFooter: true
                },
                name: 'search',
                // props: true,//1.第一种写法，只能传递params参数
                // props: {//2.第二种写法，传递固定参数
                //     a: 1,
                //     b: 2
                // },
                // props: ($route) => {//3.第三种写法，函数式子，params和query都能传参数
                //     return {
                //         keyword: $route.params.keyword,
                //         k: $route.query.k
                //     }
                // }
            },
            {
                path: '/detail/:skuId',
                component: ()=>import('@/pages/Detail'),
                meta: {
                    showFooter: true
                },
                name: 'detail',
            },
            {
                path: '/addCartSuccess',
                component: ()=>import('@/pages/AddCartSuccess'),
                meta: {
                    showFooter: true
                },
                name: 'addCartSuccess',
            },
            {
                path: '/shopCart',
                component: ()=>import('@/pages/ShopCart'),
                meta: {
                    showFooter: true
                },
                name: 'shopCart',
            },
            {
                path: '/trade',
                component: ()=>import('@/pages/Trade'),
                meta: {
                    showFooter: true
                },
                name: 'trade',
                //组件独享路由
                beforeEnter(to, from, next) {
                    if (from.path === '/shopCart') {
                        next()
                    } else {
                        next(false)
                    }
                }
            },
            {
                path: '/pay',
                component: ()=>import('@/pages/Pay'),
                meta: {
                    showFooter: true
                },
                name: 'pay',
                beforeEnter(to, from, next) {
                    if (from.path === '/trade') {
                        next()
                    } else {
                        next(false)
                    }
                }
            },
            {
                path: '/paySuccess',
                component: ()=>import('@/pages/PaySuccess'),
                meta: {
                    showFooter: true
                },
                name: 'paySuccess',
            },
            {
                path: '/center',
                component: ()=>import('@/pages/Center'),
                meta: {
                    showFooter: true
                },
                name: 'center',
                children: [
                    {
                        path: 'myOrder',
                        component: ()=>import('@/pages/Center/MyOrder'),
                        name: 'myOrder',
                    },
                    {
                        path: 'groupOrder',
                        component: ()=>import('@/pages/Center/GroupOrder'),
                        name: 'groupOrder',
                    },
                    {
                        path: '/center',
                        redirect: '/center/myOrder'
                    }
                ]
            },
            //重定向,访问/时，定位到首页
            {
                path: '*',
                redirect: '/home'
            }
        ],
        scrollBehavior(to, from, savedPosition) {
            //让每次跳转后的滚动条都回到最上方
            return {y: 0}
        }
    }
)

router.beforeEach((to, from, next) => {
    /*
    next用法
    //next() 放行到to
    //next('/login') 放行到指定位置
    next(false) 拒绝登陆，地址并且回到from
    */
    let token = getUserToken()
    if (token) {
        //登陆了
        if (to.path === '/login' || to.path === '/register') {
            //如果想去login或者register
            next(false)
        } else {
            next()
        }
    } else {
        //未登陆，不能前往交易与支付相关
        if (to.path.indexOf('/trade') !== -1 || to.path.indexOf('/pay') !== -1 || to.path.indexOf('/center') !== -1) {
            //将未登陆的想去的地方存储到query参数
            next(`/login/?redirect=${to.path}`)
        } else {
            next()
        }
    }
})


export default router